function patch(oldNode, vNode) {
    console.log(vNode);
    let el = createElement(vNode),
        parentElement = oldNode.parentNode;

    parentElement.insertBefore(el, oldNode.nextSibling);
    parentElement.removeChild(oldNode);
}

function createElement(vnode) {
    const { tag, children, text } = vnode;

    if (typeof tag === 'string') {
        vnode.el = document.createElement(tag);
        updateProps(vnode);
        children.map((child) => {
            vnode.el.appendChild(createElement(child));
        })
    } else {
        vnode.el = document.createTextNode(text)
    }

    return vnode.el;
}

function updateProps(vnode) {
    const el = vnode.el,
        newProps = vnode.props || {};

    for (const key in newProps) {
        if (key === 'style') {
            for (let sKey in newProps.style) {
                el.style[sKey] = newProps.style[sKey];
            }
        } else if (key === 'class') {
            console.log(el.class, 'el.class');
            el.className = el.class;
        } else {
            el.setAttribute(key, newProps[key]);
        }
    }
}

export {
    patch
}